﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
    <title>运单信息</title>
    <link href="../../script/css/bootstrap.min.css" rel="stylesheet" />
    <link href="../../script/css/bootstrap-theme.css" rel="stylesheet" />
    <link href="../../script/css/bootstrap-table.css" rel="stylesheet" />
    <link href="../../script/css/select2.css" rel="stylesheet" />
    <link href="../../script/css/bootstrap-datetimepicker.css" rel="stylesheet" />
    <script src="../../script/js/jquery-1.12.3.js"></script>
    <script src="../../script/js/bootstrap.min.js"></script>
    <script src="../../script/js/bootstrap-table.js"></script>
    <script src="../../script/js/bootstrap-table-zh-CN.js"></script>
    <script src="../../script/js/select2.full.js"></script>
    <script src="../../script/js/bootstrap-datetimepicker.js"></script>
    <script src="../../script/js/bootstrap-datetimepicker.zh-CN.js"></script>
</head>
<body>
    <style>
        .row {
            margin-top: 1em;
        }
    </style>
    <div class="container">
        <div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
            <div class="panel panel-default">
                <div class="panel-heading" role="tab" id="headingOne">
                    <h4 class="panel-title">
                        <a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
                            路线选择
                        </a>
                    </h4>
                </div>
                <div id="collapseOne" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingOne">
                    <div class="panel-body">
                        <div class='row'>
                            <input id="id123" />
                            <div class='col-md-6'>
                                <label>发货地</label>
                                <select class='form-control' name='barea' data-type='select'></select>
                            </div>
                            <div class='col-md-6'>
                                <label>目的地</label>
                                <select class='form-control' name='earea' data-type='select'></select>
                            </div>
                        </div>

                        <div class="row">
                            <div class='col-md-6'>
                                <a class="btn btn-default" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo" aria-expanded="true" aria-controls="collapseTwo">
                                    下一步
                                </a>
                                <button class="btn btn-danger" onclick="test();">下一步</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="panel panel-default">
                <div class="panel-heading" role="tab" id="headingTwo">
                    <h4 class="panel-title">
                        <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
                            提货人信息
                        </a>
                    </h4>
                </div>
                <div id="collapseTwo" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingTwo">
                    <div class="panel-body">
                        <div class='row'>
                            <div class='col-md-6'>
                                <label>提货人</label>
                                <input class='form-control' name='thname' data-type='text' />
                            </div>
                            <div class='col-md-6'>
                                <label>提货人手机</label>
                                <input class='form-control' name='thphone' data-type='text' />
                            </div>
                        </div>
                        <div class='row'>
                            <div class='col-md-6'>
                                <label>重量（吨）</label>
                                <input class='form-control' name='weight' data-type='text' />
                            </div>
                            <div class='col-md-6'>
                                <label>体积（方）</label>
                                <input class='form-control' name='volume' data-type='text' />
                            </div>
                        </div>
                        <div class='row'>
                            <div class='col-md-6'>
                                <label>货物总价</label>
                                <input class='form-control' name='tolvalue' data-type='text' />
                            </div>
                        </div>
                        <div class='row'>
                            <div class='col-md-12'>
                                <label>说明</label>
                                <textarea class='form-control' name='remark' data-type='text'></textarea>
                            </div>
                        </div>
                        <div class="row">
                            <div class='col-md-6'>
                                <button class="btn btn-default">下一步</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="panel panel-default">
                <div class="panel-heading" role="tab" id="headingThree">
                    <h4 class="panel-title">
                        <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
                            选择承运商
                        </a>
                    </h4>
                </div>
                <div id="collapseThree" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingThree">
                    <div class="panel-body">
                        <div class="row">
                            <div class='col-md-6'>
                                <label>发货方</label>
                                <select class='form-control' name='company1' data-type='select'></select>
                            </div>
                        </div>
                        <div class="row">
                            <div class='col-md-6'>
                                <button class="btn btn-default">下一步</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="panel panel-default">
                <div class="panel-heading" role="tab" id="headingFour">
                    <h4 class="panel-title">
                        <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseFour" aria-expanded="false" aria-controls="collapseThree">
                            费用信息
                        </a>
                    </h4>
                </div>
                <div id="collapseFour" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingFour">
                    <div class="panel-body">
                        <div class='row'>

                            <div class='col-md-6'>
                                <label>运费</label>
                                <input class='form-control' name='yf' data-type='text' />
                            </div>

                            <div class='col-md-6'>
                                <label>保费</label>
                                <input class='form-control' name='bf' data-type='text' />
                            </div>
                        </div>

                        <div class='row'>
                            <div class='col-md-6'>
                                <label>运费返点</label>
                                <input class='form-control' name='yffd' data-type='text' />
                            </div>

                            <div class='col-md-6'>
                                <label>保费返点</label>
                                <input class='form-control' name='bffd' data-type='text' />
                            </div>
                        </div>

                        <div class='row'>

                            <div class='col-md-6'>
                                <label>提成</label>
                                <input class='form-control' name='tc' data-type='text' />
                            </div>
                        </div>

                        <div class="row">
                            <div class='col-md-6'>
                                <button class="btn btn-default">下一步</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script>
        $(function () {
            $('#collapseFour').on('show.bs.collapse', function () {
                if ($('input#id123').val() == '') {
                    return false;
                }
                return true;
            });
            $('#collapseFour').on('shown.bs.collapse', function () {
                alert('shown');
            });
            //hide.bs.collapse
            //hidden.bs.collapse
        })

        function test() {
            $('#collapseFour').collapse('toggle')
        }
    </script>
</body>
</html>
